import 'dart:ui';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
import 'package:flutter/rendering.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        useMaterial3: false,
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(title: const Text("Flutter App")),
        body: const MyHomePage(),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Wrap(
      // alignment: WrapAlignment.center,  //配置布局,居中
      direction: Axis.horizontal,   //配置排列方式,纵向和横向
      spacing: 10,    //水平间距
      runSpacing: 5,  //垂直间距
      children: [
        Button(text: "第1集", onPressed: () {}),
        Button(text: "第2集", onPressed: () {}),
        Button(text: "第3集", onPressed: () {}),
        Button(text: "第4集", onPressed: () {}),
        Button(text: "第5集", onPressed: () {}),
        Button(text: "第6集", onPressed: () {}),
        Button(text: "第7集(第二季)", onPressed: () {}),
        Button(text: "第8集", onPressed: () {}),
        Button(text: "第9集", onPressed: () {}),
        Button(text: "第10集", onPressed: () {}),
        Button(text: "第11集", onPressed: () {}),
        Button(text: "第12集", onPressed: () {}),
        Button(text: "第13集", onPressed: () {}),
        Button(text: "第14集", onPressed: () {}),
        Button(text: "第15集", onPressed: () {}),
      ],
    );
  }
}

class Button extends StatelessWidget {
  String text;
  void Function()? onPressed;

  Button({super.key, required this.text, this.onPressed});

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
        style: ButtonStyle(
          backgroundColor: MaterialStateProperty.all(
              const Color.fromARGB(242, 255, 244, 244)),
          foregroundColor: MaterialStateProperty.all(Colors.black45),
        ),
        onPressed: onPressed,
        child: Text(text));
  }
}
